import styles from "./index.module.scss";
import { useSelector, useDispatch } from "react-redux";
import { setLayers } from "@/store";
export default function ModelView(props) {
  const { title, imgSlot, height, contentSLot } = props;
  const content = contentSLot();
  const img = imgSlot();
  const layers = useSelector((state) => {
    return state.layers;
  });
  const theme = useSelector((state) => {
    return state.theme;
  });
  const dispatch = useDispatch();
  const openModel = (name) => {
    dispatch(
      setLayers({
        query: {},
        name,
        other: {},
      })
    );
  };
  return (
    <>
      <div
        className={theme ? styles.topContentLight : styles.topContent}
        style={{ height: height + "px" }}
      >
        <div className={styles.subTitle}>
          {img}
          <span className={theme ? styles.titleLight : styles.title}>
            {title}
          </span>
        </div>
        {content}
      </div>
    </>
  );
}
